<template>
  <h1>只读的计算属性</h1>
  <p>name:{{name}}</p>
  <p>name:{{name}}</p>
  <p>name:{{name}}</p>
  <p>name:{{name}}</p>
</template>

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  name: "About",
});
</script>

<script setup lang="ts">
  import {ref , computed} from "vue"
  let firstName = ref("刘")
  let lastName = ref("二")

  //只读只写一个回调函数
  let name = computed(()=>{
    //计算属性有缓存，如果依赖的值不改变，不管使用多少次，这个函数就执行一次
    console.log(1);
    return firstName.value + lastName.value
  })
</script>